<!--网站顶部-->
{extend name="Public:centerheard" /}
{block name='body'}
<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2" style="height:100%;">
    <div id="main" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
        <main class="home__main">
            <section>
                <div class="home__part">
                    <div class="home__innertitle">
                        <h1 class="home__title">相册详情</h1>
                        <p class="home__albumnumber">
                        <span aria-atomic="true" class="home__dec">
                            <!-- react-text: 165 -->共有<!-- /react-text -->
                            <i class="home__highlight"><!-- react-text: 167 --> <!-- /react-text --><!-- react-text: 168 -->{$album_num}<!-- /react-text --><!-- react-text: 169 --> <!-- /react-text --></i>
                            <!-- react-text: 170 -->个相册<!-- /react-text --></span>
                            <span aria-atomic="true" class="home__dec">
                                <!-- react-text: 172 -->共有<!-- /react-text -->
                                <i class="home__highlight">
                                <!-- react-text: 174 --> <!-- /react-text --><!-- react-text: 175 -->{$photo_num}<!-- /react-text -->
                                <!-- react-text: 176 --> <!-- /react-text -->
                                </i><!-- react-text: 177 -->张图片<!-- /react-text -->
                            </span>
                        </p>
                    </div>
                    <div class="home__innerbtn">
                        <a class="button" href="{:url('shop/photos/index')}">去上传</a>
                    </div>
                </div>
                <div class="home__part">
                    <div class="home__innertitle">
                        <h1 class="home__title">免费账户</h1>
                        <p><span aria-atomic="true" class="home__dec">
                        <!-- react-text: 185 -->使用时间至<!-- /react-text -->
                        <i class="home__highlight">
                            <!-- react-text: 187 -->
                            <!-- /react-text -->
                            <!-- react-text: 188 -->不限<!-- /react-text -->
                        </i>
                            <!-- react-text: 189 --><!-- /react-text -->
                    </span>
                        </p>
                    </div>
                    <div class="home__innerbtn"><!-- react-empty: 191 -->
                        <a class="button" href="/upgrade">升级</a>
                        <a href="/consumption"><span class="clickable">消费详情</span></a>
                    </div>
                </div>
            </section>
            <hr>
            <section>
                <h1 class="home__title">使用情况</h1>
                <div class="home__flex home__part">
                    <div role="progressbar" aria-valuenow="5" class=" home__indicator Indicator__main ">
                        <svg class="Indicator__annulus" viewBox="0 0 100 100">
                            <circle class="Indicator__circle1" cx="50" cy="50" r="50" fill-opacity="0" stroke="#9f9f9f" stroke-width="30"></circle>
                            <circle class="Indicator__circle2" cx="50" cy="50" r="50" fill-opacity="0" stroke="#58c0ea" stroke-width="30" transform="scale(1, -1) translate(0, -100), rotate(90, 50, 50)" stroke-dashoffset="15.700000000000001" stroke-dasharray="0,314,400"></circle>
                        </svg>
                        <span class="Indicator__text">
                        <i class="Indicator__number">5</i>
                        <i class="Indicator__unit">%</i>
                    </span>
                    </div>
                    <div class="home__dec">
                        <p>
                            <span class="home__dec">空间使用情况</span>
                            <br>
                            <span class="home__highlight">
                            <i class=" ">已用5M</i><!-- react-text: 212 -->/<!-- /react-text --><!-- react-text: 213 -->总共100M<!-- /react-text -->
                        </span>
                            <br>
                        </p>
                        <a class="button small " href="/upgrade">扩展</a>
                        <p class="home__recycletip">
                            <span class="home__dec">回收站占1.06M</span>
                            <span class="clickable">清空</span>
                        </p>
                    </div>
                </div>
                <div class="home__flex home__part">
                    <div role="progressbar" aria-valuenow="0" class=" home__indicator Indicator__main ">
                        <div class="Indicator__graph">
                            <svg class="Indicator__stroke" viewBox="0 0 200 100" style="top: 95%;">
                                <g transform="translate(0 -952.36)">
                                    <path class="Indicator__wave3" d="m200 957.36c-17.004 10.483-33.643-6.2211-70.827-5.3088-8.911 0.21861-24.161 3.0258-29.111 5.5607-18.318 9.3807-41.586-7.8176-81.496-5.2072-9.9071 0.65-18.57 4.96-18.57 4.96l0.0043888 95h200z" fill-rule="evenodd" fill="#fff"></path>
                                </g>
                            </svg>
                            <div class="Indicator__inner">
                                <div class="Indicator__img">
                                    <svg viewBox="0 0 200 100" style="top: 95%;">
                                        <g transform="translate(0 -952.36)">
                                            <path class="Indicator__wave1" d="m200 957.36c-13.137-2.0625-30.304-5.2136-37.273-1.757-12.768 6.3329-26.339 6.2281-31.963 6.878-10.587 1.2234-51.842-13.151-68.037-6.878-14.48 5.6088-27.232 6.2764-31.963 6.878-9.851 1.26-30.77-5.12-30.77-5.12l0.0043888 95h200z" fill-rule="evenodd" fill="#fff"></path>
                                        </g>
                                        <g transform="translate(0 -952.36)">
                                            <path class="Indicator__wave2" d="m200 957.36c-17.004 10.483-33.643-6.2211-70.827-5.3088-8.911 0.21861-24.161 3.0258-29.111 5.5607-18.318 9.3807-41.586-7.8176-81.496-5.2072-9.9071 0.65-18.57 4.96-18.57 4.96l0.0043888 95h200z" fill-rule="evenodd" fill="#fff"></path>
                                        </g>
                                    </svg>
                                </div>
                            </div>
                        </div>
                        <span class="Indicator__text">
                        <i class="Indicator__number">0</i>
                        <i class="Indicator__unit">%</i>
                    </span>
                    </div>
                    <div class="home__dec">
                        <p>
                            <span class="home__dec">外链流量使用情况</span>
                            <br>
                            <span class="home__highlight">
                            <i class=" ">已用0B</i><!-- react-text: 241 -->/<!-- /react-text --><!-- react-text: 242 -->总共1G<!-- /react-text -->
                        </span>
                            <br>
                        </p>
                        <a class="button small " href="/upgrade">购买额外流量</a>
                        <a class="onlydesktop" href="/flow">
                            <span class="clickable">查看详情</span>
                        </a>
                    </div>
                </div>
            </section>
            <hr>
        </main>
    </div>
</div>
{/block}}